<template>
		<iframe v-if='videoUrl' @event1="event1" @event2="event2" :onload="onloadCode" src="about:blank"
			style="border:1px solid;height: 100%;width: 100%" marginwidth="0" marginheight="0"></iframe>
</template>

<script>
	export default {
		props: {
			videoUrl: {
				type: String,
				default: () =>
					`https://open.ys7.com/v3/openlive/J22653029_1_1.m3u8?expire=1676615524&id=546337979833004032&t=3a98e54bf568b56f96ac9f6ca61336391c7130279920000310e48c6bfc24d89d&ev=100`
			},
		},
		data() {
			return {
				onloadCode: `
				const url = '${this.videoUrl}'
				this.contentWindow.document.body.innerHTML =
				'<video preload="none" style="width: 100%;height: 100%" controls="controls" src="' + url + '"></video>';
				const iframe = top.document.getElementsByTagName('iframe')[0]
				var evObj = document.createEvent('MouseEvents');
				evObj.initEvent('event1', true, false);
				iframe.dispatchEvent(evObj)
				`
			}
		},
		onShow() {

		},

		methods: {
			event1(a) {
			},
			event2(a) {
			}
		}
	}
</script>

<style>
</style>